<template>
  <!-- 必须条件 -->
  <section>
    <el-form-item v-if="question.conditions" label="必须：">
      <el-switch v-model="question.conditions.required"></el-switch>
    </el-form-item>
    <el-form-item v-if="question.conditions" label="性别：">
      <el-row>
        <el-col :span="6">
          <el-switch v-model="checkSex" @change="enableSwitch"></el-switch>
        </el-col>
        <el-col :span="18">
          <el-radio-group v-if="checkSex" v-model="question.conditions.sex">
            <el-radio label="1">男</el-radio>
            <el-radio label="2">女</el-radio>
          </el-radio-group>
        </el-col>
      </el-row>
    </el-form-item>
  </section>
</template>

<script>
  import Vue from 'vue'

  export default {
    name: "edit-condition-manager",
    props: ['question'],
    data() {
      return {
        checkSex: false
      }
    },
    created() {
      if (!this.question.conditions) {
        //因为视图已经初始化，所以要这种方式 设置新的属性
        Vue.set(this.question, 'conditions', {
          required: false,
          sex:-1,
        })
      }else{
        if(this.question.conditions.sex>0)
          this.checkSex = true
      }
      console.log(this.question)
    },
    methods:{
      enableSwitch(e){
        //console.log(e)
        if(!e) this.question.conditions.sex=-1
      },
    }
  }
</script>

<style lang="scss">

</style>
